<template>
	<view>
		<view class="logo">
			<image class="logo_img" src="@/static/images/common/daniudai-logo.png"></image>
			<view class="logo_text">{{name}}</view>
		</view>
		<view class="verify_code">
			<text>{{verifyLogin}}</text>
		</view>
		<view class="input_area">
			<input v-model="loginUsername" placeholder="手机号" type="number" maxlength="11" class="input_class" />
		</view>
		<view class="input_area">
			<input v-model="loginPassword" placeholder="密码" type="password" class="input_class" />
		</view>
		<view class="remember_passwd">
			<checkbox value="rememberPasswd" style="transform:scale(0.8);color:#F0AD4E" checked ></checkbox>
			<text>{{rememberPasswd}}</text>
		</view>
		<view style="padding: 0 10%;text-align: center;">
			<text style="color: red;">{{message}}</text>
		</view>
		<view class="input_area">
			<view class="login_button" @click="goLogin">登 录</view>
		</view>
		<view class="user_agreement">
			<checkbox value="rememberPasswd" style="transform:scale(0.8);color:#F0AD4E" checked ></checkbox>
			已阅读并同意<label style="color: #F0AD4E;">《用户服务协议》</label>和<label style="color: #F0AD4E;">《隐私协议》</label>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				loginUsername:"",
				loginPassword:"",
				name:"大牛袋商铺登录",
				message:"",
				verifyLogin:"验证码登录",
				mobile:"",
				rememberPasswd:"记住密码" 
			}
		},
		methods: {
			goLogin(){
				console.log('login')
				uni.switchTab({
					url:"../index"
				})
			}
		}
	}
</script>

<style>
.logo{
	text-align: center;
}
.logo_img{
	margin-top: 50rpx;
	width: 200px;
	height: 200px;
}
.logo_text{
	font-size: 40rpx;
	color: #F0AD4E;
	margin-top: -70rpx;
}
.verify_code{
	float: right;
	margin-top: 200rpx;
	margin-right: 40rpx;
	margin-bottom: 30rpx;
	color: #999999;
	font-size: 32rpx;
	text-decoration: underline;
}
.input_area {
	padding: 20upx 10%;
}

.input_class {
	border: 2px solid #ccc;
	border-radius: 44upx;
	outline: 0;
	width: 90%;
	padding: 16upx 30upx;
	background-color: #FFFFFF;
}
.remember_passwd{
	font-size: 30rpx;
	padding: 10upx 10%;
	color: #999999;
}
.login_button {
		background: #2fc25b;
		color: #FFFFFF;
		border-radius: 44upx;
		font-size: 36upx;
		text-align: center;
		padding: 20rpx;
	}
.user_agreement{
	font-size: 30rpx;
	padding: 10upx 5%;
	color: #999999;
}
</style>
